
<button nz-button nzType="primary" (click)="showAddModal({id:0})" style="margin-bottom: 20px;">新增</button>
<nz-table #expandTable [nzData]="listOfMapData">
  <thead>
  <tr>
    <th nzWidth="40%">分类名字</th>
    <th nzWidth="40%">分类图标</th>
    <th>操作</th>
  </tr>
  </thead>
  <tbody>
  <ng-container *ngFor="let data of expandTable.data">
    <ng-container *ngFor="let item of mapOfExpandedData[data.id]">
      <tr *ngIf="(item.parent && item.parent.expand) || !item.parent">
        <td
          [nzIndentSize]="40"
          [nzShowExpand]="!!item.childrens"
          [(nzExpand)]="item.expand"
          (nzExpandChange)="collapse(mapOfExpandedData[data.id], item, $event)"
        >
          {{ item.name }}
        </td>
        <td>
          <nz-upload
            class="avatar-uploader"
            nzAction="{{API_URL}}/admin/classify/setimg"
            nzListType="picture-card"
            [nzShowUploadList]="false"
            [nzBeforeUpload]="beforeUpload"
            [nzCustomRequest]="customReq"
            (click)="uploadId(item.id)"
            *ngIf="!item.parent"

          >
            <img [src]="item.image" class="avatar" />
          </nz-upload>
        </td>
        <td>
          <button nz-button nzSize="default" nzType="primary" (click)="showAddModal(item)" *ngIf="!item.parent">增加子分类</button>
          <button nz-button nzSize="default" nzType="primary" (click)="showModal(item)">修改名字</button>
        </td>
      </tr>
    </ng-container>
  </ng-container>
  </tbody>
</nz-table>
<nz-modal
  [(nzVisible)]="isVisible"
  nzTitle="修改姓名"
  (nzOnCancel)="handleCancel()"
  (nzOnOk)="handleOk()"
  [nzOkLoading]="isOkLoading"
>
  <input nz-input placeholder="修改姓名" [(ngModel)]="editName" style="margin-bottom: 20px;"/>
</nz-modal>
<nz-modal
  [(nzVisible)]="addVisible"
  nzTitle="增加分类"
  (nzOnCancel)="handleAddCancel()"
  (nzOnOk)="handleAddOk()"
  [nzOkLoading]="addOkLoading"
>
  <input nz-input placeholder="增加分类" [(ngModel)]="addName" style="margin-bottom: 20px;"/>
</nz-modal>

